@import './reset.less';
@import './normalize.less';

body {
	background-color: #fff;
}
.ihwpay {
	&>.title {
		width: 100%;
		height: 0.5rem;
		line-height: 0.5rem;
		background-color: #fff;
		position: relative;
		box-shadow: 0 0.02rem 0.04rem 0 rgba(0,0,0,0.07);
		i {
			position: absolute;
			left: -0.05rem;;
			font-size: 0.2rem;
			color: #666;
			margin-left: 0.19rem;
		}
		span {
			float: right;
			font-family: PingFangSC-Medium;
			font-size: 0.17rem;
			color: #303030;
			text-align: center;
			width: 100%;
			height: 100%;
		}
	}
	.head {
		width: 100%;
		.head-top {
			width: 100%;
			height: 1.2rem;
			line-height: 1.2rem;
			background-image: url('/src/images/paybanner.png');
			background-position: center center;
			background-size: auto 100%;
			background-repeat: no-repeat;  
			p {
				font-family: PingFangSC-Medium;
				font-size: 0.17rem;
				color: #FFFFFF;
				float: left;
				margin-left: 0.15rem;
			}
		}
		.head-bottom {
			width: 100%;
			height: 0.96rem;
			background: #F4F4F4;
			padding: 0.16rem 0.15rem;
			position: relative;
			font-family: PingFangSC-Regular;
			font-size: 0.14rem;
			color: #666666;
			letter-spacing: 0;
			line-height: 0.18rem;
			img {
				display: block;
				width: 0.2rem;
				height: 0.14rem;
				position: absolute;
				left: 0.5rem;
				top: -0.12rem;
			}
		}
	}
	.demand {
		width: 100%;
		padding-bottom: 0.3rem;
		overflow: hidden;
		.demand-title {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			width: 100%;
			padding-top: 0.1rem;
			height: 0.86rem;
			img {
				width: 3.23rem;
				height: 0.36rem;
			}
		}
		.demand-detail {
			padding: 0 0.15rem;
			li {
				float: left;
				width: 1.65rem;
				height: 2.23rem;
				padding: 0.15rem;
				border: 0.01rem solid #E5E5E5;
				margin-bottom: 0.15rem;
				&:nth-child(2n) {
					margin-left: 0.15rem;
				}
				h6 {
					font-family: PingFangSC-Semibold;
					font-size: 0.24rem;
					color: #1CA5ED;
					text-align: left;
					margin-bottom: 0.12rem;
				}
				span {
					display: block;
					font-family: PingFangSC-Regular;
					font-size: 0.16rem;
					color: #333333;
					margin-bottom: 0.12rem;
					line-height: 1.4;
				}
				p {
					font-family: PingFangSC-Regular;
					font-size: 0.14rem;
					color: #999999;
					margin-bottom: 0.12rem;
					line-height: 1.4;
				}
				img {
					display: block;
					width: 1.28rem;
					height: 0.36rem;
				}
			}
		}
	}
	.theme {
		width: 100%;
		height: 3.6rem;
		.theme-title {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			width: 100%;
			height: 0.76rem;
			img {
				width: 0.81rem;
				height: 0.36rem;
			}
		}
	}
	.swiper-pagination-bullet {
		width: 0.16rem;
		height: 0.03rem;
		border-radius: 0;
	}
	.swiper-wrapper {
		.swiper-slide  {
			height: 2.6rem;
			p {
				font-family: PingFangSC-Regular;
				font-size: 0.17rem;
				color: #333333;
				text-align: center;
				margin-top: 0.16rem;
			}
			img {
				display: block;
				margin: 0 auto;
			}
			&:nth-child(1) {
				width: 100%;
			
				img {
					width: 2.66rem !important;
					height: 1.6rem !important;
					margin: 0 auto;
				}
				
			}
			&:nth-child(2) {
				width: 100%;
			
				img {
					width: 2.66rem !important;
					height: 1.6rem !important;
					margin: 0 auto;
				}
				
			}
			&:nth-child(3) {
				width: 100%;
			
				img {
					width: 0.8rem !important;
					height: 1.6rem !important;
					margin: 0 auto;
				}
				
			}
			&:nth-child(4) {
				width: 100%;
			
				img {
					width: 2.32rem !important;
					height: 1.59rem !important;
					margin: 0 auto;
				}
				
			}
			&:nth-child(5) {
				width: 100%;
			
				img {
					width: 0.8rem !important;
					height: 1.6rem !important;
					margin: 0 auto;
				}
				
			}
			&:nth-child(6) {
				width: 100%;
			
				img {
					width: 2.66rem !important;
					height: 1.6rem !important;
					margin: 0 auto;
				}
				
			}
			&:nth-child(7) {
				width: 100%;
				
				img {
					width: 2.66rem !important;
					height: 1.6rem !important;
					margin: 0 auto;
				}
				
			}
		}
	}

	
	.foot {
			width: 100%;
			height: 1.6rem;
			margin-top: 1.4rem;
			background-color: #fff;
			background-image: url('/src/images/bg5.png');
			background-position: center;
			background-size: auto 100%;
			position: relative;
			.our {
				width: 3.45rem;
				height: 2.54rem;
				background-color: #fff;
				position: absolute;
				top: -1.27rem;
				left: 50%;

				margin-left: -1.72rem;
				padding: 0.3rem 0.2rem;
				box-shadow: 0.02rem 0.05rem 0.15rem 0 rgba(138,136,136,0.50);
				border-radius: 0.08rem;
				.our-top {
					margin-bottom: 0.32rem;
					width: 100%;
					height: 0.24rem;
					line-height: 0.24rem;
					.left {
						float: left;
						width: 0.64rem;
						height: 0.02rem;
						background-color: #ccc;
						margin-right: 0.11rem;
						margin-top: 0.12rem;
					}
					
					.cente {
						float: left;
						font-family: PingFangSC-Regular;
						font-size: 0.17rem;
						color: #162133;
						span {
							display: inline-block;
							font-family: PingFangSC-Regular;
							font-size: 0.13rem;
							color: #999999;
							margin-left: 0.02rem;
						}
					}
					.right {
						float: left;
						margin-top: 0.12rem;
						width: 0.64rem;
						height: 0.02rem;
						background-color: #ccc;
						margin-left: 0.11rem;
					}
				}
				.our-bottom {
					width: 100%;
					height: 1.7rem;
				}
				.our-bottom-left {
					width: 1.7rem;
					float: left;
					li {
						width: 100%;
						height: 0.45rem;
						font-family: PingFangSC-Medium;
						font-size: 0.16rem;
						i {
							color: #666;
							font-size: 0.18rem;
							margin-right: 0.08rem;
						}
						&:first-child {
							color: #1CA5ED;
							span {
								color: #333;
								font-size: 0.13rem;
								margin-left: 0.26rem;
							}
						}
						&:nth-child(2) {
							color: #333;
							font-size: 0.13rem;
							span {
								margin-left: 0.26rem;
							}
						}
						&:nth-child(3) {
							color: #333;
							font-size: 0.13rem;
						}
					}
				}
				.our-bottom-right {
					float: right;
					width: 1.1rem;
					img {
						&:first-child {
							display: block;
							width: 1.07rem;
							height: 0.38rem;
						}
						&:last-child {
							display: block;
							width: 1.1rem;
							height: 1.1rem;
						}
					}
				}
			}
		}
	.footer {
		width: 100%;
		background: #333333;
		height: 0.72rem;
		padding-top: 0.17rem;
		text-align: center;
		img {
			width: 0.2rem;
			height: 0.2rem;
			vertical-align: text-top;

		}
		p {
			font-family: PingFangSC-Regular;
			font-size: 0.13rem;
			color: #CCCCCC;
			line-height: 0.18rem;
		}
	}
}

.swiper-pagination-bullet {
	border-radius: 0 !important;
	background: #eee !important;
	opacity: 1 !important;
}
.swiper-pagination-bullet-active {
	background: #1CA5ED !important;
}